<template>
	<view>
		<topbar title="钱包" jt_c="2" background="background:#222222;color:#fff;"></topbar>
		<view class="tg_bz dis_f_l_c">
			<view class="dis_f_c_c" @click="go_txmx">提现明细</view>
		</view>
		<view class="content">
			<view class="top dis_f_co">
				<view class="dis_f_sb">
					<view class="dis_f_co">
						<view style="margin-bottom: 6rpx;">当前零钱</view>
						<view class="title">{{user.money}}</view>
						<view style="margin-bottom: 6rpx;display: flex;justify-content: center;align-items: center;">
							<view class="ck_btn dis_f_c_c" style="margin-right: 20rpx;" @click="go_tx">提现</view>
						<view class="ck_btn dis_f_c_c" style="margin-left: 20rpx;" @click="go_cz">充值</view>
							
						</view>
						
						<view>累计收益: {{user.moremoney}}</view>
					</view>
					<view class="dis_f_co">
						<view style="margin-bottom: 6rpx;">当前金币</view>
						<view class="title">{{user.currency}}</view>
						
					</view>
				</view>
			</view>
			<view style="margin-bottom: 37rpx;">
				<u-tabs :list="list" bg-color="none" active-color="#222222" bar-width="196" bar-height="4" inactive-color="#BBBBBB" :is-scroll="false" :current="current" @change="change"></u-tabs>
			</view>
			<view class="dis_f_co">
				<view class="bottom" v-for="(item,index) in log">
					<view style="margin-bottom: 12rpx;" class="dis_f_sb_c">
						<view>{{item.title}}</view>
						<view style="color: #BBBBBB;font-size: 22rpx;">{{item.money}}</view>
					</view>
					<view style="color: #BBBBBB;font-size: 22rpx;line-height: 32rpx;width: 100%;" class="dis_f_sb_c">
						<view>{{item.remark}}</view>
						<view>{{item.create_time}}</view>
					</view>
				</view>
				<view style="padding-bottom: 100rpx;">
					<u-loadmore :status="status"/>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
					name: '零钱'
				},{
					name: '金币'
				} ],
				current: 0,
				hy_level:true,
				user:[],
				log:[],
				zys:'',
				page:1,
				status:'loadmore',
				type:1,
			};
		},
		onLoad() {
			
		},
		onShow() {
			this.page = 1;
			this.log = [];
			this.$.ajax(1, 'post', 'index/getuser', {
				uid:uni.getStorageSync('uid'),
				token:uni.getStorageSync('token')
			}, (res) => {
				console.log(res)
				if(res.code == 1){
				this.user = res.userinfo
				}
				
			})
			this.getlog(this.type)
			
		},
		methods: {
			getlog(e){
				this.$.ajax(1, 'post', 'index/checktokens', {
					uid:uni.getStorageSync('uid'),
					token:uni.getStorageSync('token')
				}, (res) => {
					console.log(res)
					if(res.code == 9){
						this.$.ti_shi('token已过期，请重新登陆')
					uni.clearStorageSync()
						setTimeout( () => {
							uni.navigateTo({
								url:'/pages/login/login'
							})
						}, 1000)
					return;
					}
					else{
						this.get_list(e);
					}
				})
				
			},
			get_list (e) {
				this.$.ajax(1, 'post', 'index/getmoneylog', {
					uid:uni.getStorageSync('uid'),
					token:uni.getStorageSync('token'),
					cate:e,
					page:this.page,
				}, (res) => {
					console.log(res)
					if(res.code == 1){
						this.zys = res.pagecount
						res.list.forEach((item,index)=>{
							this.log.push(item);
						})
					}else{
						this.status = 'nomore';
					}
				})
			},
			change(index) {
				this.current = index;
				this.log = [];
				if(index == 0){
					this.type = 1;
					this.getlog(1)
				}else{
					this.type = 0;
					this.getlog(0)
				}
			},
			go_tx(){
				this.$.ajax(1, 'post', 'index/checktokens', {
					uid:uni.getStorageSync('uid'),
					token:uni.getStorageSync('token')
				}, (res) => {
					console.log(res)
					if(res.code == 9){
						this.$.ti_shi('token已过期，请重新登陆')
					uni.clearStorageSync()
						setTimeout( () => {
							uni.navigateTo({
								url:'/pages/login/login'
							})
						}, 1000)
					return;
					}
					else{
							this.$.open('/pages/mine/new_tx')
					}
				})
				
			},
			go_cz(){
				this.$.ajax(1, 'post', 'index/checktokens', {
					uid:uni.getStorageSync('uid'),
					token:uni.getStorageSync('token')
				}, (res) => {
					console.log(res)
					if(res.code == 9){
						this.$.ti_shi('token已过期，请重新登陆')
					uni.clearStorageSync()
						setTimeout( () => {
							uni.navigateTo({
								url:'/pages/login/login'
							})
						}, 1000)
					return;
					}
					else{
						this.$.open('/pages/mine/ti_xian?cz='+1)
					}
				})
				
			},
			go_txmx(){
				this.$.ajax(1, 'post', 'index/checktokens', {
					uid:uni.getStorageSync('uid'),
					token:uni.getStorageSync('token')
				}, (res) => {
					console.log(res)
					if(res.code == 9){
						this.$.ti_shi('token已过期，请重新登陆')
					uni.clearStorageSync()
						setTimeout( () => {
							uni.navigateTo({
								url:'/pages/login/login'
							})
						}, 1000)
					return;
					}
					else{
							this.$.open('/pages/mine/tx_mx')
					}
				})
				
			},
			
		},
		onReachBottom() {
			// var xiabiao = this.current;
			
			if(this.page+1 <= this.zys){
				this.status = 'loading';
				this.page = ++this.page;
				this.getlog(this.type);
			}else{
				this.status = 'nomore';
				return;
			}
		}
	}
</script>

<style lang="scss">
	.tg_bz{
		position: fixed;
		z-index: 999;
		font-size: 22rpx;
		line-height: 32rpx;
		top: calc(var(--status-bar-height) + 30rpx);
		right: 48rpx;
		color: #fff;
		image{
			width: 34rpx;
			height: 34rpx;
			margin-right: 6rpx;
		}
		
	}
	.content {
		width: 100%;
		padding: 0 24rpx 0 24rpx;
		top: calc(var(--status-bar-height) + 124rpx);
		
		z-index: 998;
		position: absolute;
		
		.top {
			width: 100%;
			padding: 36rpx 56rpx 20rpx 48rpx;
			height: 318rpx;
			position: relative;
			background-image: url(../../static/mine/qbbg.png);
			background-size: 100% 100%;
			// padding: 36rpx 0 24rpx 48rpx;
			margin-bottom: 44rpx;
			color: #fff;
			.title{
				font-size: 72rpx;
				line-height: 100rpx;
				margin-bottom: 12rpx;
			}
		}

		.text1 {
			font-size: 22rpx;
			line-height: 32rpx;
			margin-bottom: 14rpx;
		}

		.text2 {
			font-size: 34rpx;
			line-height: 48rpx;
			margin-bottom: 14rpx;
		}

		.ck_btn {
			width: 144rpx;
			height: 50rpx;
			border-radius: 30rpx;
			background-color: #E23C63;
			margin-bottom: 24rpx;
			font-size: 22rpx;
		}

		.sj {
			font-size: 22rpx;
			line-height: 32rpx;
			position: absolute;
			bottom: 24rpx;
			right: 24rpx;
		}
		.bottom{
			width: 100%;
			padding: 36rpx 24rpx;
			background-color: #fff;
			box-shadow: 0rpx 6rpx 24rpx rgba(34, 34, 34, 0.05);
			border-radius: 20rpx;
			margin-bottom: 12rpx;
		}
	}
</style>
